<template>
  <div>
    <p v-if="favouriteList.length === 0" style="margin: 0 auto;width: 100px">空空如也</p>
    <historyTag v-for="(ihistory,idx) in favouriteList" :ihistory="ihistory" :key="idx"/>
    <div class="block" v-show="favouriteList.length > 10">
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="currentPage"
        :page-sizes="[10, 20]"
        :page-size="10"
        layout="total, sizes, prev, pager, next, jumper"
        :total="favouriteList.length">
      </el-pagination>
    </div>
  </div>
</template>
<script>
import historyTag from './common/historyTag'
export default {
  data () {
    return {
      currentPage: 0
    }
  },
  components: {
    historyTag
  },
  methods: {
    handleSizeChange (val) {
      console.log(`每页 ${val} 条`)
    },
    handleCurrentChange (val) {
      console.log(`当前页: ${val}`)
    }
  },
  computed: {
    favouriteList () {
      return this.$store.getters.favouriteList
    }
  },
  mounted () {
    this.$store.dispatch('showCollectionMovie')
  }
}
</script>
